import React, { PureComponent } from 'react';
import { Card, message, Button, Radio,Modal } from 'antd'
import { PageContainer } from '@ant-design/pro-layout';
import { getHandle } from '@/services/baseurl'
import { simulationPoints } from '@/services/setting'
import { dev ,isLianxi,learnTime,stopExamIfTimeNotEnough,hasProgressFunc} from '@/utils/utils'
import { submitExam,topicQuestionBank,getExamList } from '@/services/studentExam'
import { getStudentSubject } from '@/services/studentPractice'
import * as imgs from '@/assets/index'
import styles from './index.less'
class SelectMore extends PureComponent<any, any> {
    constructor(props: any) {
        super(props)
        this.state = {
            data: [],
            showAnswer: 1,
            questionType: 1,
            loading:false
        };
    }
    changeShowAnswer = (e: any) => {
        this.setState({
            showAnswer: e.target.value
        })
    }
    changeQuestionType = (e: any) => {
        this.setState({
            questionType: e.target.value
        })
    }
    jumpToExam=()=>{
        const {showAnswer,questionType} = this.state;
        const { subject,subjects } = this.props.match.params;
        const uid = localStorage.getItem("id");
        let name = '';
        if(questionType===5){
          name='随机出题'
        }else if(questionType===4){
          name='错题优先'
        }else{
          name='未答题优先'
        }
        const operation = `进入了模拟考试（${name}）`;
        // if(questionType===9){
        //    this.props.history.push(`/exam/${subject}/${showAnswer}`)
        // }else{
          this.setState({
            loading:true
          })
          topicQuestionBank({ id: uid, type:questionType, subject }).then(res => {
            if (res[0][0] || res[1][0] || res[2][0]) {
                simulationPoints(uid).then((res) => {
                
                    if (res.status === 1) {
                        getHandle({ operation });
                        submitExam({
                            duration: "",
                            pid: '',
                            uid,
                            grade: "0",
                            total: "0",
                            correct_total: "0",
                            did_total: "0",
                            topic: [[], [], []],
                            answer: [[], [], []],
                            label: '',
                            wrong: '',
                            id: "",
                        }).then((res) => {
                          this.setState({
                            loading:false
                          })
                          this.props.history.push(`/examPage2/${res.id}/${questionType}/${subject}/${subjects}/${showAnswer}`)
                          // window.open(dev + `#/examPage2/${res.id}/${questionType}/${subject}/${subjects}/${showAnswer}`, '考试中心', 'width=' + (window.screen.availWidth - 10) + ',height=' + (window.screen.availHeight - 20) + ',top=0,left=0,resizable=no,status=yes,menubar=no,scrollbars=yes');
                        });
                    } else {
                      this.setState({
                        loading:false
                      })
                        message.error("积分不足");
                    }
                });
            } else {
              this.setState({
                loading:false
              })
                message.error('题库中没有题')
            }

        })
         
        // }
      }

      checkPaperList = (subject:any)=>{
        const uid = localStorage.getItem("id") || "";
        getExamList({uid,subject,type:'3'}).then(res=>{
            if(res&&res[0]){
                this.setState({
                    showManual:true
                })
            }else{
                this.setState({
                    showManual:false
                })
            }
        })
    }
    componentDidMount() {
        const uid = localStorage.getItem("id") || "";
        const percent = localStorage.getItem("percent") || "";
        const { subjects } = this.props.match.params;
        getStudentSubject({ uid }).then((res) => {
            if (!res.subjects) return;
            this.setState({
                cascaderData: res.subjects,
                subject: [res.subjects[0].id],
                subjects: [res.subjects[0].title],
            });
            this.checkPaperList(res.subjects[0].id)
            if (hasProgressFunc() && Number(percent) < learnTime() && stopExamIfTimeNotEnough()) {
                return Modal.info({
                    title: <p style={{ fontSize: 20, marginTop: -3 }}>操作提醒</p>,
                    content: <p style={{ fontSize: 18 }}>您的学习时长未达标，请到学时达标后再进行模拟考试</p>,
                    okText: '确定',
                    style: { fontSize: 30, color: "#f60" },
                    onOk: () => {
                        history.go(-1);
                    },
                });
            }
        });
    }
    render() {
        const {showAnswer,questionType,loading} = this.state;
        const { name } = JSON.parse(localStorage.getItem("userinfo")||'');
        const { subjects } = this.props.match.params;
        return (
            <PageContainer title="模拟考试">
                <Card>
                <img src={imgs.default.exam_avatar} className={styles['exam_avatar']} alt=" " />
          <p className={styles['name']}>{name}</p>
          <ul className={styles['exam-form']}>
            <li className={styles['exam-form-item']}>
              <label className={styles['label']}>考试科目</label>
              <section>{decodeURI(subjects)}</section>
            </li>
            <li className={styles['exam-form-item']}>
              <label className={styles['label']}>试题数量</label>
              <section>100题</section>
            </li>
            <li className={styles['exam-form-item']}>
              <label className={styles['label']}>考试时间</label>
              <section>60分钟</section>
            </li>
            <li className={styles['exam-form-item']}>
              <label className={styles['label']}>合格标准</label>
              <section>
              {isLianxi()?'满分100分 80分及格':'满分100分 70分及格'}
                
              </section>
            </li>
            <li className={styles['exam-form-item']}>
              <label className={styles['label']}>出题方式</label>
              <section>
                <Radio.Group value={questionType} onChange={this.changeQuestionType}>
                 <div> <Radio style={{fontSize:16}} value={1} >未答题优先</Radio></div>
                 <div> <Radio style={{fontSize:16}} value={4} >错题优先</Radio></div>
                 <div> <Radio style={{fontSize:16}} value={5} >随机出题</Radio></div>
                </Radio.Group>
              </section>
            </li>
            <li className={styles['exam-form-item']}>
              <label className={styles['label']}>答案提示</label>
              <section>
              <Radio.Group value={showAnswer} onChange={this.changeShowAnswer}>
                 <div> <Radio style={{fontSize:16}} value={1} >显示答案</Radio></div>
                 <div> <Radio style={{fontSize:16}} value={2}>不显示答案</Radio></div>
                </Radio.Group>
              </section>
            </li>
           
          </ul>

          <Button onClick={this.jumpToExam} loading={loading} className={styles['start-exam-button']} style={{width:'30%',height:50}} type="primary">开始考试</Button>
                </Card>
            </PageContainer>
        );
    }
}

export default SelectMore;
